// 主页鉴权
import nProgress from 'nprogress'
import 'nprogress/nprogress.css'
import router from './router'
import store from './store'
import { asyncRoutes } from '@/router/index'
// 白名单
const whiteList = ['/login', '/404']
// 路由前置导航守卫：主页鉴权，使用token和白名单，判断用户用户是否具有进入到主页的权限
// to:当前路由去哪儿(路由规则对象)
// from:当前路由从哪来(路由规则对象)
// next:是否放行当前路由，类型是函数。
// 放行：next()
// 不放行：将路由拦截到某处：next('目标路径')

router.beforeEach(async(to, from, next) => {
  // 开启进度条
  nProgress.start()
  // 获取token
  const token = store.getters.token
  // 判断是否有token
  if (token) {
  // 有token,
  // 判断用户进的是不是登录页
    if (to.path === '/login') {
      // 有token,进的是登录页，被引导到首页
      next('/')
      // 经验：如果使用next('目标路径')，此时不会执行后置导航守卫，无法关闭进度条
      // 解决：手动关闭进度条
      nProgress.done()
    } else {
      // 有token,进入的不是登录页，直接放行
      // 调用获取登录用户基本信息的action:如果没有获取过资料，才调用
      if (!store.getters.userId) {
        // 调用获取登录用户基本信息的action
        // 注意点：dispatch是异步的，需求中必须保证先拿到用户基本信息，在跳转页面渲染
        // const res = await store.dispatch('user/getUserInfo')
        // console.log(res)
        const { roles } = await store.dispatch('user/getUserInfo')
        // console.log(roles)
        // console.log(roles.menus)
        // console.log(asyncRoutes)
        // 设置所有的动态路由，根据用户关联的权限《筛选》出用户可以访问的路由
        const flitercRouters = asyncRoutes.filter(item => {
          // 满足条件的路由对象保留下来：路由对象的name属性值在roles.menus中是否存在，存在就被筛选出来
          return roles.menus.includes(item.name)
        })
        // console.log(flitercRouters)

        // 将筛选出来的路由存在VueX中，src\store\modules\user.js
        store.commit('user/setRoutes', flitercRouters)

        // 将筛选出来的动态路由添加到 全局路由对象router
        // 经验：为了不让静态路由总出现 path:'*' ， 必须写在路由最后面 ！！！
        // addRoutes方法：不是响应式的，可以使用VueX手动的共享路由信息，制造响应式路由数据(VueX中的数据都是响应式的)
        router.addRoutes([...flitercRouters, { path: '*', redirect: '/404', hidden: true }])
        // 解决404问题：由于路由(vue路由插件)的缺陷，此时动态路由还需要明显的转发一次路由
        next(to.path)
      } else {
        next()
      }
    }
  } else {
    // 无token,
    // 判断路由是否在白名单，如果在,就放行
    if (whiteList.includes(to.path)) {
      next()
    } else {
      next('/login')
      nProgress.done()
    }
    // 注意点：一旦写了前置守卫,不写next()的话，路由会被拦截,页面被拦截
    // next()
  }
})
// 路由后置导航守卫：
router.afterEach(() => {
// 关闭进度条
  nProgress.done()
})
